import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
import Pages from "vite-plugin-pages";
import Layouts from 'vite-plugin-vue-layouts';
import Components from 'unplugin-vue-components/vite';
import path from 'path';
import eslintPlugin from 'vite-plugin-eslint';
import legacy from '@vitejs/plugin-legacy';
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers';
const dependencies = require('./package.json').dependencies;

// https://vitejs.dev/config/
export default defineConfig(({mode}) => {
  // 根据当前工作目录中的 `mode` 加载 .env 文件
  // 设置第三个参数为 '' 来加载所有环境变量，而不管是否有 `VITE_` 前缀。
  const env = loadEnv(mode, process.cwd(), '')
  return {
    plugins: [
      vue(),
      legacy({
        targets: ['defaults', 'not IE 11']
      }),
      Pages({
        dirs: "src/pages", // 需要生成路由的文件目录，默认就是识别src下面的pages文件
        exclude: ["**/components/*.vue"], // 排除在外的目录，上面配置目录的例子，里面有 components 目录，我们不希望他被解析为路由
      }),
      Layouts({
        layoutsDirs: 'src/layouts',
        defaultLayout: 'default',
      }),
      Components({
        resolvers: [
          AntDesignVueResolver({
            importStyle: false, // css in js
          }),
        ],
      }),
      eslintPlugin({
        include: ['src/**/*.js', 'src/**/*.vue', 'src/*.js', 'src/*.vue'],
      })
    ],
    base: './',
    resolve: {
      alias: [
        { find: '@', replacement: path.resolve(__dirname, './src') }
      ]
    },
    // 全局访问变量
    define: {
      __APP_ENV__: env.APP_ENV,
    },
    server: {
      port: 3001,
      host: '0.0.0.0',
      proxy: {
        '/dev': {
          target: 'http://worldgroupoa.hatchsolution.cn/api', 
          changeOrigin: true, //支持跨域
          rewrite: (path) => path.replace(/^\/dev/, ""),  //重写路径,替换/dev
        }
      }
    },
    preview: {
      port: 3002,
      host: '0.0.0.0',
    },
    build: {
      ssr: false, // 是否启用ssr渲染
      brotliSize: false, 
      minify: true,
      rollupOptions: {
        treeshake: true,
        output: {
          assetFileNames: assetInfo => {
            var info = assetInfo.name.split('.')
            var extType = info[info.length - 1]
            if (
              /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/i.test(assetInfo.name)
            ) {
              extType = 'media'
            } else if (/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(assetInfo.name)) {
              extType = 'img'
            } else if (/\.(woff2?|eot|ttf|otf)(\?.*)?$/i.test(assetInfo.name)) {
              extType = 'fonts'
            }
            return `static/${extType}/[name]-[hash][extname]`
          },
          manualChunks(id) {
            if (id.includes('node_modules')) {
              // 指定需要拆分的第三方库或模块
              const dependenciesKeys = Object.keys(dependencies);
              const match = dependenciesKeys.find((item) => {
                return id.includes(item);
              });
              console.info('match', match)
              const notSplit = ['vue', 'ant-design-vue'];
              if (match && !notSplit.includes(match)) {
                return match;
              }
            }
          },
          chunkFileNames: 'static/js/[name]-[hash].js',
          entryFileNames: 'static/js/[name]-[hash].js'
        }
      }
    }
  }
})
